<template>
  <div>
    <el-form inline :model="FEditRole" label-width="80px" size="medium">
      <el-form-item label="角色名称">
        <el-input v-model="FEditRole.FRoleName" readonly></el-input>
      </el-form-item>
      <el-form-item label="角色状态">
        <el-input v-model="FEditRole.FStatusCode" readonly></el-input>
      </el-form-item>
    </el-form>
    <el-tabs ref="myTabs" :style="styleObject">
      <el-tab-pane>
        <template #label>
          <span><i class="el-icon-date"></i>菜单权限</span>
        </template>
        <TFormRoleRightMenu :zContextParams="FEditRole"> </TFormRoleRightMenu>
      </el-tab-pane>
      <el-tab-pane>
        <template #label>
          <span><i class="el-icon-date"></i>接口权限</span>
        </template>
        <TFormRoleRightApi :zContextParams="FEditRole"> </TFormRoleRightApi>
      </el-tab-pane>
      <!-- <el-tab-pane>
        <template #label>
          <span><i class="el-icon-date"></i>Fast权限</span>
        </template>
        <TFormRoleRightMenu> </TFormRoleRightMenu>
      </el-tab-pane>
      <el-tab-pane>
        <template #label>
          <span><i class="el-icon-date"></i>功能权限</span>
        </template>
        <TFormRoleRightMenu> </TFormRoleRightMenu>
      </el-tab-pane> -->
    </el-tabs>
  </div>
</template>

<script  lang="ts">
import { TBaseRole } from "@/baselib/right/BaseRightClass";
import { Options } from "vue-class-component";
import TFormBase from "@/views/BaseForm";
import elmHelper, { IElmTreeData } from "../../model/elmHelper";
import TFormRoleRightMenu from "@/views/rightManage/Role/right/RoleRightMenu.vue";
import TFormRoleRightApi from "@/views/rightManage/Role/right/RoleRightApi.vue";
//配合着用
@Options({
  name: "TFormRoleRightEdit",
  components: {
    TFormRoleRightMenu,
    TFormRoleRightApi,
  },
  data() {},
})
export default class TFormRoleRightEdit extends TFormBase {
  declare $refs: {
    myTabs: any;
  };
  private styleObject: any = {
    "margin-top": "10px",
    height: "200px",
    "overflow-y": "auto",
  };

  private FEditRole: TBaseRole = new TBaseRole();
  //
  public async created() {
    this.FEditRole = this.zIndexTag?.menuParams;
    if (this.$myStrHelper.stringIsEmptyYW(this.FEditRole.FRoleID)) {
      this.$myMsgHelp.msgDialog(
        "打开数据有误,传进来的参数【" + JSON.stringify(this.FEditRole)
      );
    }
    //this.openData();
  }
  //打开数据
  public async openData() {
    if (!this.$myStrHelper.stringIsEmpty(this.FEditRole.FRoleID)) {
      //打开数据
      this.zIsOpenData = false;
      let lResult = await this.$myBaseRightAPI.getRole(this.FEditRole.FRoleID);
      if (!lResult.resultSuccess) {
        this.$myMsgHelp.msgDialog(lResult.resultMsg);
        return;
      }
      this.FEditRole = lResult.resultData;
      if (this.$myStrHelper.stringIsEmptyYW(this.FEditRole.FRoleID)) {
        this.$myMsgHelp.msgDialog(
          "返回的数据结构有问题:" + JSON.stringify(lResult.resultData)
        );
        return;
      }
      this.FEditRole.tempPRoleID = this.FEditRole.FPRoleID;
      this.zIsOpenData = true;
    } else {
      this.zIsOpenData = true;
    }
  }
  public mounted() {
    //自适应列表高
    this.$nextTick(() => {
      if (this.$refs.myTabs.$el != null) {
        let lHeight =
          window.innerHeight - this.$refs.myTabs.$el.offsetTop - 120;
        this.styleObject = {
          "margin-top": "10px",
          height: lHeight + "px",
          "overflow-y": "auto",
        };
      }
    });
    window.addEventListener("resize", () => {
      this.$nextTick(() => {
        if (this.$refs.myTabs.$el != null) {
          let lHeight =
            window.innerHeight - this.$refs.myTabs.$el.offsetTop - 120;
          this.styleObject = {
            "margin-top": "10px",
            height: lHeight + "px",
            "overflow-y": "auto",
          };
        }
      });
    });
  }
}
</script>
<style>
</style>